{% extends 'goods/base.html' %}
{% load static %}
{% block aa %}
    <div class="content inner">
    <section class="filter-section clearfix">
        <ol class="breadcrumb">
            <li><a href="{% url 'goods:index' %}">首页</a></li>
            <li class="active">商品筛选</li>
        </ol>
        <div class="filter-box">
            <div class="all-filter">
                <div class="filter-value">
                    <div class="filter-title">选择商品分类 <i class="iconfont icon-down"></i></div>
                    <!-- 全部大分类 -->
                    <ul class="catelist-card">
                        <a href="">
                            <li class="active">全部分类</li>
                        </a>
                        <a href="{% url 'goods:item_category' gid=2%}">
                            <li>女装</li>
                        </a>
                        <a href="{% url 'goods:item_category' gid=1%}">
                            <li>男装</li>
                        </a>
                        <a href="{% url 'goods:item_category' gid=4%}">
                            <li>包包</li>
                        </a>
                        <a href="{% url 'goods:item_category' gid=3%}">
                            <li>童装</li>
                        </a>
                        <a href="{% url 'goods:item_category' gid=5%}">
                            <li>鞋靴</li>
                        </a>
                    </ul>
                    <!-- 已选选项 -->
{#                    <div class="ul_filter">#}
{#							<span class="pull-left">#}
{#								颜色：红色 <a href="javascript:" class="close">&times;</a>#}
{#							</span>#}
{#                        <span class="pull-left">#}
{#								尺寸：XXL <a href="javascript:" class="close">&times;</a>#}
{#							</span>#}
{#                    </div>#}
{#                    <a class="reset pull-right" href="#">重置</a>#}
                </div>
            </div>
            <div class="filter-prop-item">
                <span class="filter-prop-title">颜色：</span>
                <ul class="clearfix">
{#                    <a href="">#}
{#                        <li class="active">全部</li>#}
{#                    </a>#}
                    {% for good in color %}
                        <a href="">
                            <li>{{ good.color }}</li>
                        </a>
                    {% endfor %}
                </ul>
            </div>
{#            <div class="filter-prop-item">#}
{#                <span class="filter-prop-title">尺寸：</span>#}
{#                <ul class="clearfix">#}
{#                    <a href="">#}
{#                        <li class="active">全部</li>#}
{#                    </a>#}
{#                    {% for foo in size %}#}
{#                        <a href="">#}
{#                        <li>{{ foo.size }}</li>#}
{#                    </a>#}
{#                    {% endfor %}#}
{#                </ul>#}
{#            </div>#}
            <div class="filter-prop-item">
                <span class="filter-prop-title">价格：</span>
                <ul class="clearfix">
{#                    <a href="">#}
{#                        <li class="active">全部</li>#}
{#                    </a>#}
                    <a href="">
                        <li>0-20</li>
                    </a>
                    <a href="">
                        <li>20-40</li>
                    </a>
                    <a href="">
                        <li>40-80</li>
                    </a>
                    <a href="">
                        <li>80-100</li>
                    </a>
                    <a href="">
                        <li>100-150</li>
                    </a>
                    <a href="">
                        <li>150以上</li>
                    </a>
{#                    <form class="price-order">#}
{#                        <input type="text">#}
{#                        <span class="cc">-</span>#}
{#                        <input type="text">#}
{#                        <input type="button" value="确定">#}
{#                    </form>#}
                </ul>
            </div>
        </div>
        <div class="sort-box bgf5">
            <div class="sort-text">排序：</div>
            <a href="">
                <div class="sort-text">销量 <i class="iconfont icon-sortDown"></i></div>
            </a>
            <a href="">
                <div class="sort-text">评价 <i class="iconfont icon-sortUp"></i></div>
            </a>
            <a href="">
                <div class="sort-text">价格 <i class="iconfont"></i></div>
            </a>
            <div class="sort-total pull-right">共{{ length }}个商品</div>
        </div>
    </section>
    <section class="item-show__div clearfix">
        <div class="pull-left">
            <div class="item-list__area clearfix">
                {% for x in page_obj %}
                    <div class="item-card">
                        <a href="{% url 'goods:item_show' qid=x.id%}" class="photo">
                            <img src=" {{ x.image }}" alt="{{ x.name }}"
                                 class="cover">
                            <div class="name">{{ x.name }}</div>
                        </a>
                        <div class="middle">
                            <div class="price">
                                <small>￥</small>{{ x.price }}
                            </div>
{#                            <div class="sale">#}
{#                                <a href="">加入购物车</a>#}
{#                            </div>#}
                        </div>
                        <div class="buttom">
                            <div>销量 <b>{{ x.code }}</b></div>
                            <div>人气 <b>888</b></div>
                            <div>评论 <b>{{ x.details }}</b></div>
                        </div>
                    </div>
                {% endfor %}
            </div>
            <!-- 分页 -->
            <div class="page text-right clearfix">
                {% if page_obj.has_previous %}
                    <a href="{% url 'goods:item_category' gid=gid %}?page={{page_obj.previous_page_number}}" aria-label="Previous">
                        <span aria-hidden="true">&laquo;</span></a>
                {% endif %}
                    {% for foo in page_num %}
                        {% if foo == page_obj.number %}
                            <a href="{% url 'goods:item_category' gid=gid %}?page=1" aria-label="Previous" class="select">{{ foo }}</a>
                        {% else %}
                            <a href="{% url 'goods:item_category' gid=gid %}?page={{ foo }}">{{ foo }}</a>
                        {% endif %}
                {% endfor %}
                    {% if page_obj.has_next %}
                     <a href="{% url 'goods:item_category' gid=gid %}?page={{page_obj.next_page_number}}" aria-label="Next">
                          <span aria-hidden="true">&raquo;</span></a>
                  {% endif %}
            </div>
        </div>
        <div class="pull-right">
            <div class="desc-segments__content" style="height: 1350px">
                <div class="lace-title">
                    <span class="c6">爆款推荐</span>
                </div>
                <div class="picked-box">
                    {% for fidd in fiddsh %}
                        <a href="{% url 'goods:item_show' qid=fidd.id %}" class="picked-item"><img src="{{ fidd.image }}" alt="{{ fidd.name }}" class="cover"><span
                            class="look_price">¥{{ fidd.price }}</span></a>
                    {% endfor %}
                </div>
            </div>
        </div>
    </section>
</div>
{% endblock %}
